<template>
    <div>
        <top-bar rightButton="" :title="title"></top-bar>
        <catalog :listHeight="listHeight" :chapters="chapters" :sort="sort" @goRead="goRead" @onSort="onSort"></catalog>
        <wxc-loading :show="isShow" ></wxc-loading>
    </div>
</template>

<style scoped>

</style>

<script>
    import TopBar from '../components/bar/TopBar'
    import Catalog from '../components/book/Catalog'
    import {book_chapter} from '../store/actions'
    import {Utils, WxcLoading} from 'weex-ui'
    import {getRealScreenHeight} from "../util/Config";
    export default {
        name: "book-catalog",
        components: {TopBar, Catalog, WxcLoading},
        data() {
            return {
                title: '',
                bookId: '',
                sourceId: '',
                content: undefined,
                sort: false,
                chapters: undefined,
                listHeight: getRealScreenHeight(Utils),
                isShow: false,
            }
        },
        mounted() {
            this.bookId = this.$route.query.bookId || '';
            this.sourceId = this.$route.query.sourceId || '';
            this.isShow = true;
            book_chapter({
                bookId: this.bookId,
                sourceId: this.sourceId,
                callback: (data) => {
                    this.content = data;
                    this.bookId = this.content.book;
                    this.sourceId = this.content._id;
                    this.title = this.content.bookName;
                    this.chapters = this.content.chapters;
                },
                after:  () => {
                    this.isShow = false;
                },
            });
        },
        methods: {
            goRead(obj) {
                console.log(obj)
                let index = this.sort ? (this.chapters.length - obj.chapterIndex - 1) : obj.chapterIndex;
                this.$router.push({name: 'read', query: {chapterIndex: index, bookId: this.bookId, sourceId: this.sourceId}});
            },
            onSort(){
                this.sort = !this.sort;
            }
        }
    }
</script>